<template>
  <view>
    <div class="flex">
      <image src="/static/logo.png" class="w-20 h-20 rounded-full" />
      <div class="m-2 flex flex-col gap-1">
        <div class="font-bold items-center flex justify-between gap-1 ">
          <text class="w-40 truncate text-[#333333]">
            {{ author }}
          </text>
          <text class="font-light p-1 rounded-md text-xs text-[#686868]">{{ dayjs(createdAt).format("YYYY-MM-DD HH:mm")
          }}</text>
        </div>
        <div class="text-[#686868]">
          <div>
            {{ content }}
          </div>
          <!-- <div>
            {{ rate }}
          </div> -->
        </div>
      </div>
    </div>

  </view>
</template>

<script setup>
import dayjs from 'dayjs'
import { ref } from 'vue'

const props = defineProps({
  author: String,
  content: String,
  rate: Number,
  createdAt: String,
  receiver: String,
})

</script>